{include file="public/header" /}
<style type="text/css">
    #des, #des input {
        width: 40px;
        text-align: center;
    }

    #id {
        width: 78px;
    }

    .bs-checkbox {
        width: 36px;
        height: 40px
    }

    .fixed-table-toolbar .columns, .fixed-table-toolbar .search {
        margin-left: 0px;
        margin-top: 0px
    }

    #title span {
        float: right;
    }

    .btn-active {
        background: #1ab394;
        color: #fff
    }
</style>
<body class="gray-bg">
<div class="wrapper wrapper-content">
    <div class="ibox float-e-margins">
        {include file="public/tophead"}
        {include file="public/top" /}
        <div class="ibox-content">
            <div class="row row-lg">
                <div class="col-sm-12">
                    <div class="fixed-table-toolbar">
                        <a class="btn btn-default btn-outline{if input('get.type') eq ''} btn-active{/if}" href="{:url('member/videoVerify')}">所有内容</a>
                        <a class="btn btn-default btn-outline{if input('get.type/d') eq 1} btn-active{/if}" href="{:url('member/videoVerify', ['type' => '1'])}">审核列表</a>
                        <a class="btn btn-default btn-outline{if input('get.type/d') eq 2} btn-active{/if}" href="{:url('member/videoVerify', ['type' => '2'])}">通过列表</a>
                        <a class="btn btn-default btn-outline{if input('get.type/d') eq 3} btn-active{/if}" href="{:url('member/videoVerify', ['type' => '3'])}">拒绝列表</a>
                    </div>
                    <div style="display:block;clear: both;"></div>
                    <div class="fixed-table-toolbar">
                        <form method="get" action="">
                            <div class="pull-left search">
                                <div class="columns columns-right btn-group pull-left">
                                    <select class="form-control" name="type">
                                        <!--<option value="id">用户ID</option>-->
                                        <option value="nickname">昵称</option>
                                        <option value="username">手机</option>
                                    </select>
                                </div>
                                <div class="pull-right search">
                                    <button style="border-radius:0px; border:1px solid #e5e6e7; border-left:0px"
                                            class="btn btn-default btn-outline" type="submit">搜索
                                    </button>
                                </div>
                                <div class="pull-right search">
                                    <input class="form-control input-outline" type="text" name="text" value="{:input('get.text', '')}" />
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="example">
                        <form class="form-horizontal" method="post">
                            <table data-toggle="table">
                                <thead>
                                    <tr>
                                        <th data-align="center">ID</th>
                                        <th data-align="center">头像</th>
                                        <th data-align="center">昵称</th>
                                        <th data-align="center">性别</th>
                                        <th data-align="center">手机</th>
                                        <th data-align="center">认证照片&视频</th>
                                        <th data-align="center">申请时间</th>
                                        <th data-align="center">审核时间</th>
                                        <th data-align="center">状态</th>
                                        <th data-align="center">管理</th>
                                    </tr>
                                </thead>
                                <tbody>
                                {volist name="data" id="vo"}
                                    <tr>
                                        <td>{$vo.id}</td>
                                        <td>
                                            <img src="{if empty($vo.avatar)}__PUBLIC__/disk/avatar/user-default.jpg{else}{$vo.avatar}{/if}" width="40" height="40" />
                                        </td>
                                        <td>{$vo.nickname}</td>
                                        <td>
                                            {switch $vo.sex}
                                            {case 1}男{/case}
                                            {case 2}女{/case}
                                            {default /}其他
                                            {/switch}
                                        </td>
                                        <td>{$vo.username}</td>
                                        <td>
                                            <span onClick="view({$vo.id}, {$vo.member_id},'{$vo.verify_content}')" style="color:#40BCF7;cursor:pointer;">查看</span>
                                        </td>
                                        <td>{$vo.create_time|date="Y-m-d H:i:s"}</td>
                                        <td>
                                            {if $vo.review_time > 0}
                                              {$vo.review_time|date="Y-m-d H:i:s"}
                                            {else} - {/if}
                                        </td>
                                        <td>
                                            {switch $vo.status}
                                            {case 1}待审核{/case}
                                            {case 2}审核通过{/case}
                                            {default /}审核不通过
                                            {/switch}
                                        </td>
                                        <td>
                                            <div data-toggle="dropdown" class="btn btn-primary btn-xs dropdown-toggle">
                                                操作 <span class="caret"></span>
                                            </div>
                                            <ul class="dropdown-menu">
                                                {if $vo.status eq 1}
                                                <li><a href="javascript:;" onclick="verify({$vo.id})">审核</a></li>
                                                {else}
                                                <li><a href="javascript:;" onclick="view({$vo.id}, {$vo.member_id},'{$vo.verify_content}');">查看认证照片&视频</a></li>
                                                {/if}
                                            </ul>
                                        </td>
                                    </tr>
                                {/volist}
                                </tbody>
                            </table>
                        </form>
                    </div>
                </div>
            </div>
            <hr>
            <div class="row row-lg">
                <div class="col-sm-12 pages">{$page|raw}</div>
            </div>
        </div>
    </div>
</div>
<div style="text-align:center;display:none;" id="view">
    <div style="width: 100%;background-color: #0a0d0d;color: #f1f1f1;font-size: 2em;font-weight:bold;line-height: 2em;"></div>
    <div class="layui-carousel" id="carousel">
        <div carousel-item=""></div>
    </div>
</div>
<div id="verify" style="text-align:center;display:none;margin: 0px 30px;padding:10px 0 10px 0">
    <form class="form-horizontal">
        <div class="form-group">
            <label class="col-sm-3 control-label">原因：</label>
            <div class="col-sm-6">
                <input type="text" name="reason" class="form-control" value="" placeholder="请输入原因" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">审核状态：</label>
            <div class="col-sm-6">
                <select name="status" class="form-control">
                    <option value="">请选择..</option>
                    <option value="2">通过</option>
                    <option value="3">不通过</option>
                </select>
            </div>
        </div>
    </form>
</div>
{include file="public/footer" /}
{load href="__STYLE__/admin/plugins/bootstrap/bootstrap-table.min.css"}
{load href="__STYLE__/admin/plugins/bootstrap/bootstrap-table.min.js"}
{load href="__STYLE__/admin/plugins/bootstrap/bootstrap-table-zh-CN.min.js"}
<script type="text/javascript">
function verify(id) {
    $("#verify").find('input[name="reason"]').val('');
    $("#verify").find('select[name="status"]').val('');
    layer.open({
        area: ['540px', '210px'],
        type: 1,
        title: '审核',
        content: $('#verify'),
        btn: ['确定', '取消'],
        yes: function (i) {
            var reason =  $("#verify").find('input[name="reason"]').val(),
                status = $("#verify").find('select[name="status"]').val();
            if (status.length == 0) {
                layer.msg('请选择审核状态');
                return false;
            }
            $.ajax({
                url: "{:url('member/updateVerify')}",
                type: 'POST',
                dataType: 'JSON',
                data: {id: id, reason: reason, status: status},
                success: function (res) {
                    layer.msg(res.msg);
                    setTimeout(function () {
                        if (res.code == 1) {
                            window.location.reload();
                        }
                    }, 2000);
                },
                error:function () {
                    layer.msg('网络错误');
                    return false;
                }
            });
            layer.close(i);
        }
    });
}
function view(id, member_id, text) {
    var flag = false,reg = new RegExp(/\.jpg|\.png|\.gif|\.jpeg/i);
    $.ajax({
        url: "{:url('member/getVerifySource')}",
        type: 'POST',
        data: {id: id, member_id: member_id},
        dataType: 'JSON',
        success: function (res) {
            if (res.length == 0) {
                flag = true;
                layer.alert('用户未上传任何内容', {icon: 5});
            }
            var html = '';
            $.each(res, function (key, item) {
                html += '<div>';
                if (reg.test(item)) {
                    html += '<img src="'+item+'" width="100%" height="100%" />';
                }
                if ((new RegExp(/\.mp4/i)).test(item)) {
                    html += '<video width="100%" controls="controls">';
                    html += '<source src="'+item+'" type="video/mp4" />';
                    html += '您的浏览器不支持video标签，请更换其他浏览器';
                    html += '</video>';
                }
                html += '</div>';
            });
            $("#carousel div").html(html);
        },
        error: function () {
            flag = true;
            layer.alert('网络错误!', {icon: 2});
        }
    });
    if (flag) return flag;
    setTimeout(function () {
        layui.use('carousel', function() {
            var carousel = layui.carousel;
            carousel.render({
                elem: '#carousel',
                width: '100%',
                height: '590px',
                full: false,
                anim: 'default',
                autoplay: false,
                arrow: 'hover',
                indicator: 'none'
            });
        });
        $("#view").children('div:first-child').text(text);
        layer.open({
            area: ['50%', '95%'],
            type: 1,
            title: '查看图片&视频',
            content: $('#view'),
            btn: ['关闭'],
            yes: function(index, i){
                layer.close(index);
            }
        });
    }, 150);
}
</script>